<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">

<head th:replace="layout :: common_head(~{::title})">
	<title>Order : Add</title>
</head>

<body th:replace="layout :: common_body(~{::h1},~{::#content})">
	<h1>Order : Add</h1>
	<div id="content" class="container">
		<form action="." th:object="${order}" method="post" role="form">
			<div class="form-group">
				<label for="selectCustomer">Customer</label> <select class="form-control" name="selectCustomer"
					th:field="*{customer}">
					<option th:each="customer : ${customers}" th:text="${customer.firstname}+' '+${customer.name}"
						th:value="${customer.customerId}" value="42">Rod Johnson</option>
				</select>
			</div>
			<div class="form-group">
				<label for="selectDeliveryService">Delivery Service</label> <select class="form-control"
					name="selectCustomer" th:field="*{deliveryService}">
					<option value="DHL">DHL</option>
					<option value="Hermes">Hermes</option>
				</select>
			</div>
			<h2>Shipping Address</h2>
			<div class="form-group">
				<label for="shippingAdressStreet">Street</label> <input class="form-control" name="shippingAdressStreet"
					th:field="*{shippingAddress.street}" />
			</div>
			<div class="form-group">
				<label for="shippingAdressZIP">ZIP</label> <input class="form-control" name="shippingAddressZIP"
					th:field="*{shippingAddress.zip}" />
			</div>
			<div class="form-group">
				<label for="shippingAddressCity">City</label> <input class="form-control" name="shippingAddressCity"
					th:field="*{shippingAddress.city}" />
			</div>
			<h2>Billing Address</h2>
			<div class="form-group">
				<label for="billingAdressStreet">Street</label> <input class="form-control" name="billingAdressStreet"
					th:field="*{billingAddress.street}" />
			</div>
			<div class="form-group">
				<label for="billingAdressZIP">ZIP</label> <input class="form-control" name="billingAddressZIP"
					th:field="*{billingAddress.zip}" />
			</div>
			<div class="form-group">
				<label for="billingAddressCity">City</label> <input class="form-control" name="billingAddressCity"
					th:field="*{billingAddress.city}" />
			</div>

			<div class="row">
				<div class="col-xs-2">
					<label>Id</label>
				</div>
				<div class="col-xs-2">
					<label>Count</label>
				</div>
				<div class="col-xs-2">
					<label>Item</label>
				</div>
			</div>
			<div class="row" th:each="orderLine, orderLineStat : *{orderLine}">
				<div class="col-xs-2" th:text="${orderLineStat.count}">1</div>
				<div class="col-xs-2">
					<input type="text" th:field="*{orderLine[__${orderLineStat.index}__].count}" />
				</div>
				<div class="col-xs-2">
					<select th:field="*{orderLine[__${orderLineStat.index}__].item}">
						<option th:each="item : ${items}" th:text="${item.name}" th:value="${item.itemId}" value="42">
							MacBook</option>
					</select>
				</div>
			</div>
			<div class="row">
				<button type="submit" name="addLine" formaction="./line" class="btn btn-default">Add Line</button>
				<button type="submit" name="submit" class="btn btn-default">Submit</button>
			</div>
		</form>
	</div>
</body>

</html>